<template>
	<div id="vipPay">
		<header>
			<i @click="goBack()"></i>
            <div>会员支付</div>
        </header>
        <div class='tip'>
            认证成功后，您即可享受不同时间的免费服务，同时可以享受到不同商品的折扣价！
        </div>
		<div class='content'>
			<label @change="select">
                <div>
                    <img src="../../image/icon_zhifubao_pay.png" width='33' alt="支付宝">
                    支付宝支付  
                </div>
                <input type="radio" value="支付宝" v-model="payType">
				<i></i>
                <!-- <router-link :to='{name: "authSuccess",query: {id: 1}}'>去支付</router-link> -->
            </label>
            <!-- <label @change="select">
                <div>
                    <img src="../../image/icon_weixin_pay.png" width='33' alt="微信">
                    微信支付
                </div>
                <input type="radio" value="微信" v-model="payType">
				<i></i>
                <router-link :to='{name: "authSuccess",query: {id: 1}}'>去支付</router-link>
            </label> -->
            <div class="agbox">
                <label class='agree' @click.stop='toggle(0)' :class="isagree?'checked':''">
                    我已阅读并同意相关
                    <a @click.stop='toggle(1)'>收费协议</a>
                </label>
            </div>
        </div> 
        <div class="footer">
            <a @click='goNext'>下一步</a>
        </div>
        <!-- <div class="footer">
            <a @click='refund_alipay'>退款</a>
        </div> -->
        <div class="mc" v-show="showRule" @click.stop='showRule=false'>
            <div class='rules' @click.stop='showRule=true'>
                <h3>收费细则</h3>
                <p>大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷大力金刚法律的纠纷</p>
            </div>
        </div>
	</div>
</template>
<script>
	export default {
		data() {
			return {
				payType: '支付宝',  //
                isagree:  false,    //是否同意收费细则 默认否
                showRule: false, //是否显示收费细则 默认否
                order_num: '',
                payobj:{},
			}
		},
		methods: {
			//返回上一级
			goBack() {
                this.$router.back();
            },
            //选择会员类型
			select() {
				console.log(this.payType);
            },
            init() {
                let id = this.$route.query.id;
                console.log(id);
                this.$api.get(this.$api.baseURLSchool,"select_cid/doctor_category/"+id,{},r => {
                    console.log(r);
                    if(r.data.ret == 1) {
                        this.payobj = r.data.info;
                        this.payobj.price = parseFloat(r.data.info.price);
                    }
                    
                },err => {
                    console.log(err);
                })
            },
            // 退款
            refund_alipay() {
                const data = {};
                if(this.order_num) {
                    data.order_num = this.order_num;
                } else {
                    data.order_num = new Date().getTime();
                }
                this.$api.post(this.$api.baseURL2,"refund_alipay",data,r => {
                    console.log(r);
                    if (r.data.ret == 1) {
                        var fund_change = r.data.fund_change;
                        if (fund_change == 'Y') {
                            this.$utils._toast("退款成功，资金有变动");
                        }else if (fund_change == 'N') {
                            this.$utils._toast("该订单已经退款成功，资金没有变动！！！");
                        }
                    } else if (r.data.ret == -2){
                        this.$utils._toast("先支付再退款");
                    }
                },err => {
                    console.log(err);
                },false,false)
            },
            // 支付宝付款
            pay_zhifubao() {
                const data = {
                    order_num: new Date().getTime(),
                    subject: '会员充值',
                    amount: this.payobj.price,
                };
               
                console.log(data);
                this.$api.post(this.$api.baseURL2, "/alipay_app", data, r => {
            var params = r.data.data;
            cordova.plugins.alipay.payment(params, function () {
              this.$utils._toast('支付成功');
            }, function (reason) {
              this.$utils._toast(reason);
            });
          }, err => {
            console.log(err);
          }, false, false)
            },
            // 微信支付
            pay_wx() {
                const data = {
                    order_num: new Date().getTime(),
                    body: '会员充值',
                    total_fee: this.payobj.price,
                };
                console.log(data);
                this.$api.post(this.$api.baseURL,"wx_h5pay2",data,r => {
                    console.log(r);
                    // alert(JSON.stringify(r));
                    window.location.href = res.data.mweb_url;
                },err => {
                    console.log(err);
                },false,false)
            },
            // 下一步支付
            goNext() {
                // console.log(this.isagree);
                if(this.isagree) {
                    if(this.payType == '支付宝') {
                        this.pay_zhifubao();
                    } else if(this.payType == '微信') {
                        this.pay_wx();
                    }
                    // this.$router.push({name: 'authSuccess'});
                } else {
                    this.$utils._toast("请勾选协议");
                }
            },
            // 同意或者不同意协议
            toggle(status) {  //0指同意或者不同意 1指点的是收费协议
                if(status) {
                    this.showRule = true;
                } else {
                    if(this.isagree) {
                        this.isagree = false;
                    } else {
                        this.isagree = true;
                    }
                }
            },
		},
		created() {
            this.init();
            // // 获取支付订单号
            // this.$api.get(this.$api.baseURL,"ali_order",{},r => {
            //     console.log(r);
            //     this.order_num = r.data.info;
            // },err => {
            //     console.log(err);
            // },false,false)
		}
	}

</script>
<style lang="scss" scoped>

</style>